<template>
    <h2>添加排房信息</h2>
    <table border="1">
        <tr>
            <td>房型</td>
            <td>
                <select v-model="rowRoom.RT_Id">
                    <option value="0">请选择</option>
                    <option v-for="item in type" :value="item.RT_Id">{{item.RT_Name}}</option>
                </select>
            </td>
        </tr>
        <tr>
            <td>房号</td>
            <td>
                <select v-model="rowRoom.RN_Id">
                    <option value="0">请选择</option>
                    <option v-for="item in number" :value="item.RN_Id">{{item.RN_Name}}</option>
                </select>
            </td>
        </tr>
        <tr>
            <td>排房状态</td>
            <td>
                <input type="radio" :value="0" v-model="rowRoom.RRState">正常排房
                <input type="radio" :value="1" v-model="rowRoom.RRState">打扫中
                <input type="radio" :value="2" v-model="rowRoom.RRState">房间异常
            </td>
        </tr>
        <tr>
            <td colspan="2" style="text-align:center">
                <input type="button" value="添加" @click="addRowRoom"/>
            </td>
        </tr>
      
    </table>
</template>

<script setup lang="ts">
    import {ref,onMounted} from 'vue'
    import {useRouter} from 'vue-router'
    import axios from 'axios'
    const rowRoom=ref({
        RN_Id:0,
        RT_Id:0,
        RRState:0
    })
    const addRowRoom=()=>{
        //判断房型信息不能为空
        if(rowRoom.value.RT_Id==0)
        {
            alert('房型信息必须选择');
            return;
        }
        if(rowRoom.value.RN_Id==0)
        {
            alert('房号信息必须选择');
            return;
        }
        axios.post('https://localhost:44320/api/Room/RowRoomAdd',{
            RN_Id:rowRoom.value.RN_Id,
        RT_Id:rowRoom.value.RT_Id,
        RRState:rowRoom.value.RRState
        })
        .then(res=>{
            if(res.data==-1)
            {
                alert('该房号已存在');
                return;
            }
            else if(res.data>0)
            {
                alert('添加成功');
            }
            else{
                alert('添加失败');
            }
        })
    }

    const type=ref([{
    "RT_Id": 0,
    "RT_Name": "豪华大床房"
  }])
  const number=ref([ {
    "RN_Id": 0,
    "RN_Name": "1-101"
  }])
  onMounted(()=>{
   loadTypeData();
    loadNumberData();
  })
  const loadTypeData=()=>{
    axios.get('https://localhost:44320/api/Room/GetRoomTypes')
    .then(res=>{
        type.value=res.data;
    })
    .catch(error=>{
        console.log(error);
    })
  }
  const loadNumberData=()=>{
    axios.get('https://localhost:44320/api/Room/GetRoomNumber')
    .then(res=>{
        number.value=res.data;
    })
    .catch(error=>{
        console.log(error);
    })
  }
</script>